import { Canvas, Story, Meta } from "@storybook/blocks";
import { Icon } from "metabase/ui";
import { Stack, Textarea } from "metabase/ui";
import * as TextareaStories from "./Textarea.stories";

<Meta of={TextareaStories} />

# Textarea

Our themed wrapper around [Mantine Textarea](https://v6.mantine.dev/core/textarea/).

## Docs

- [Mantine Textarea Docs](https://v6.mantine.dev/core/textarea/)

## Examples

<Canvas>
  <Story of={TextareaStories.Default} />
</Canvas>

### Size - md

<Canvas>
  <Story of={TextareaStories.EmptyMd} />
</Canvas>

#### Filled

<Canvas>
  <Story of={TextareaStories.FilledMd} />
</Canvas>

#### Asterisk

<Canvas>
  <Story of={TextareaStories.AsteriskMd} />
</Canvas>

#### Description

<Canvas>
  <Story of={TextareaStories.DescriptionMd} />
</Canvas>

#### Disabled

<Canvas>
  <Story of={TextareaStories.DisabledMd} />
</Canvas>

#### Error

<Canvas>
  <Story of={TextareaStories.ErrorMd} />
</Canvas>

#### Read only

<Canvas>
  <Story of={TextareaStories.ReadOnlyMd} />
</Canvas>

#### Autosize

<Canvas>
  <Story of={TextareaStories.AutosizeMd} />
</Canvas>

### Size - xs

<Canvas>
  <Story of={TextareaStories.EmptyXs} />
</Canvas>

#### Filled

<Canvas>
  <Story of={TextareaStories.FilledXs} />
</Canvas>

#### Asterisk

<Canvas>
  <Story of={TextareaStories.AsteriskXs} />
</Canvas>

#### Description

<Canvas>
  <Story of={TextareaStories.DescriptionXs} />
</Canvas>

#### Disabled

<Canvas>
  <Story of={TextareaStories.DisabledXs} />
</Canvas>

#### Error

<Canvas>
  <Story of={TextareaStories.ErrorXs} />
</Canvas>

#### Read only

<Canvas>
  <Story of={TextareaStories.ReadOnlyXs} />
</Canvas>

#### Autosize

<Canvas>
  <Story of={TextareaStories.AutosizeXs} />
</Canvas>
